html, body {
	background-color: #fff;
	height: 91%;
}

@media (orientation: portrait ){
	.inpu ul{
	    width: 80%;
	    display: flex;
	    flex-direction: row;
	    align-items: center;
	    /* margin: 0 auto;   */
	    margin-bottom: 10px;
	}
	.inpu ul li{
	    width: 13.5vw;
	    height: 7vh;
		border: 1px solid #DEDEDE;
	    text-align: center;
	    line-height: 7vh;
	    float: left;
		font-size: 6vw;
		border-right-style: none;
	}
	.inpu ul li:nth-child(7) {
		border: 1px solid #DEDEDE;
		/* border-top-right-radius: 10px;
		border-bottom-right-radius: 10px;		 */
	}
	.inpu ul li:last-child {
		border: 1px solid #DEDEDE;		
	}
	.inpu ul li:first-child {
		border: 1px solid #DEDEDE;		
		border-right: none;
	}
	.inpu ul li:last-of-type{
	    margin: 0;
	}
	.inpu ul li.active{
		border: 1px solid #0051BB;
	}
	.inpu ul li.xinnengyuan{
	    background: url(../images/xinnengyuan.png) no-repeat center;
	    background-size: 100% 100%; 
		border: 1px dashed #DEDEDE;
		margin-left: 5vw;
	}
	.new-eng {
		display: flex;
		flex-direction: column;
		font-size: 12px;
		line-height: initial;
		align-items: center;
		color: #8D8D8D;
	}
	.add {
		font-size: 23px;
	}
	.new-eng-text {
		
	}
	#keyboardBox{
		width: 100%;
		/* margin-top: 5vh; */
	}
	#keyboardBox .provienceBox,#keyboardBox .textBox{
	    width: 100%;
	    background-color: #D0D5D9;
	    padding-top: 10px;
	    padding-bottom: 4px;
	}
	#keyboardBox .provienceBox ul,#keyboardBox .textBox ul{
	    width: 100%;
	    display: flex;
	    flex-direction: row;
	    justify-content: space-around;
	    align-items: center;
	    margin-top: 10px;
	}
	#keyboardBox .provienceBox ul:first-of-type, #keyboardBox .textBox ul:first-of-type{
	    margin-top: 0px;
	}
	#keyboardBox .provienceBox ul li,#keyboardBox .textBox ul li{
	    width: 8vw;
	    height: 5.5vh;
	    border-radius: 6px;
	    text-align: center;
	    line-height: 5.5vh;
	    float: left;
	    background-color: #ffffff;
	    font-size: 4.3vw;
	}
	#keyboardBox .textBox{
	    display: none;
	}
	#keyboardBox .provienceBox ul .changeContentBtn,#keyboardBox .provienceBox ul .deleteBtn,#keyboardBox .textBox ul .changeContentBtn,#keyboardBox .textBox ul .deleteBtn{
	    width: 11vw;
	    height: 5.5vh;
	    background-color: #ACB3BB;
	    text-align: center;
	    line-height: 5.5vh;
	}
	#keyboardBox .provienceBox ul .deleteBtn img,#keyboardBox .textBox ul .deleteBtn img{
	    /* width: 5vw; */
	    height: 2.5vh;
	    margin: 0px;
	    margin-top: 1.5vh;
	}
}
@media ( orientation: landscape ){
	.inpu ul{
	    width: 100%;
	    display: flex;
	    flex-direction: row;
	    align-items: center;
	    /* margin: 0 auto;	     */
	}
	.inpu ul li{
	    width: 7vw;
	    height: 11vh;
	    border: 1px solid #cccccc;
	    text-align: center;
	    line-height: 11vh;
	    float: left;
		font-size: 4vw;
		border-right-style: none;
	}
	.inpu ul li:last-child{
	    border: 1px solid #cccccc;
	}
	.inpu ul li:last-of-type{
	    margin: 0;
	}
	.inpu ul li.active{
	    border: 1px solid #0051BB;
	}
	.inpu ul li.xinnengyuan{
	    background: url(../images/xinnengyuan.png) no-repeat center;
	    background-size: 100% 100%;
	    border: 1px dashed #CCCCCC;
	}
	#keyboardBox{
		width: 100%;
		margin-top: 70vw;
	}
	#keyboardBox .provienceBox,#keyboardBox .textBox{
	    width: 100%;
	    background-color: #D0D5D9;
	    padding-top: 10px;
	    padding-bottom: 4px;
	}
	#keyboardBox .provienceBox ul,#keyboardBox .textBox ul{
	    width: 100%;
	    display: flex;
	    flex-direction: row;
	    justify-content: space-around;
	    align-items: center;
	    margin-top: 10px;
	}
	#keyboardBox .provienceBox ul:first-of-type, #keyboardBox .textBox ul:first-of-type{
	    margin-top: 0px;
	}
	#keyboardBox .provienceBox ul li,#keyboardBox .textBox ul li{
	    width: 9vw;
	    height: 8vh;
	    border-radius: 6px;
	    text-align: center;
	    line-height: 8vh;
	    float: left;
	    font-size: 2.7vw;
	    background-color: #ffffff;
	}
	#keyboardBox .textBox{
	    display: none;
	}
	#keyboardBox .provienceBox ul .changeContentBtn,#keyboardBox .provienceBox ul .deleteBtn,#keyboardBox .textBox ul .changeContentBtn,#keyboardBox .textBox ul .deleteBtn{
	    width: 9vw;
	    height: 8vh;
	    background-color: #ACB3BB;
	    text-align: center;
	    line-height: 8vh;
	}
	#keyboardBox .provienceBox ul .deleteBtn img,#keyboardBox .textBox ul .deleteBtn img{
	    width: 3.5vw;
	    height: 4vh;
	    margin: 0px;
	    margin-top: 2vh;
	}
}
button {
	outline: none;
	border: none;
}
.btn-bind {
	background: #0051BB;
	width: 80%;
	height: 10vw;
	margin-left: 10vw;
	border-radius: 8px;
	color: #fff;
}
.btn-same {
    width: 92%;
    height: 7vh;
    line-height: 7vh;
    border-radius: 8px;
    font-size: 21px;
	font-weight: 100;
	font-weight: 300;
    font-size: 17px;
}
.renew-btn {
    background: #0051BC;
    color: #fff;
}
.car-num-row {
	color: #797979;
	padding-top: 0px;
	font-size: 15px;
	font-weight: 100;
}
.car-num-column {
	background: #F6F6F6;
    border-radius: 10px;
    height: 2vh;
    line-height: 2vh;
	padding: 8px;
	margin-right: 15px;
}